<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
 <%@ include file="common/commonsetlanguage.jsp" %>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>HTML5 Workshop - Tools</title>
  <link rel="stylesheet" href="js/jquery.mobile-1.0rc2.min.css" />
  <link rel="stylesheet" href="css/common.css" />
 
  <script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
  <script type="text/javascript" src="js/common/ui.js"></script>
  <script type="text/javascript" src="js/jquery.mobile-1.0.js"></script>
  <script>
  addMetaFile("homecss","tools");
 </script>
</head>
<fmt:bundle basename="app">
<body>
   <%@ include file="common/commontools.html" %>
    <div id="banner">
	  <div id="banner_item">
		  <a href="#" onClick="forward('weather/weather')"><div class="banner_left"></div></a>
			<div class="description_right">
			  <h1 class="banner_tool_name"><fmt:message key="weather"/></h1>
				<h2 class="banner_tool_description"><fmt:message key="detail"/></h2>
				<p class="banner_tool_introduction"><fmt:message key="introduce"/></p>
				<input class="use_button" type="button" value="<fmt:message key="toolsbutton"/>" onClick="forward('weather/weather')"/>
			</div>
		</div>
  </div>
  <div class="page_box" id="page_container">
    <div data-role="page" id="area1">
      <div data-role="content" id="content1">
        <!-- list-items start -->
				<ul class="icon_list six_columns four_columns">
				  <li>
		            <div class="tool_item">
		              <a href="#" onClick="forward('weather/weather')"><div class="tool_icon1 tool_hover tool_rowone"></div></a>
		              <p class="icon_name"><fmt:message key="weather"/></p>
		            </div>
		          </li>
		          <li>
		            <div class="tool_item">
		              <a href="#" onClick="forward('ip/searchIp')"><div class="tool_icon2 tool_hover tool_rowone"></div></a>
		              <p class="icon_name"><fmt:message key="ipsearch"/></p>
		            </div>
		          </li>
					<li>
					  <div class="tool_item">
							<a href="#" onClick="forward('clock/clock')"><div class="tool_icon3 tool_hover tool_rowone"></div></a>
							<p class="icon_name"><fmt:message key="timer"/></p>
						</div>
					</li>
					<li>
					  <div class="tool_item tool_row4">
							<div class="tool_icon tool_rowone"></div>
							<p class="icon_name">Cricinfo</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item">
							<div class="tool_icon"></div>
							<p class="icon_name">Cricinfo</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row2">
							<div class="tool_icon"></div>
							<p class="icon_name">Minutes</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row3">
							<div class="tool_icon"></div>
							<p class="icon_name">Weather</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row4">
							<div class="tool_icon"></div>
							<p class="icon_name">Feddly</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item">
							<div class="tool_icon tool_rowlast"></div>
							<p class="icon_name icon_namelast">Feddly</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row2">
							<div class="tool_icon tool_rowlast"></div>
							<p class="icon_name icon_namelast">Weather</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row3">
							<div class="tool_icon tool_rowlast"></div>
							<p class="icon_name icon_namelast">Minutes</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row4">
							<div class="tool_icon tool_rowlast"></div>
							<p class="icon_name icon_namelast">Cricinfo</p>
						</div>
					</li>
				</ul>
        <!-- 12 items per area -->
      </div>
		</div>
    <div data-role="page" id="area2">
      <div data-role="content" id="content2">
        <!-- list-items start -->
				<ul class="icon_list six_columns four_columns">
				  <li>
					  <div class="tool_item">
							<div class="tool_icon tool_rowone"></div>
							<p class="icon_name">sjdsdjsidjsdj</p>
						</div>
					</li>
					<li>
					  <div class="tool_item tool_row2">
							<div class="tool_icon tool_rowone"></div>
							<p class="icon_name">Weather</p>
						</div>
					</li>
					<li>
					  <div class="tool_item tool_row3">
							<div class="tool_icon tool_rowone"></div>
							<p class="icon_name">Minutes</p>
						</div>
					</li>
					<li>
					  <div class="tool_item tool_row4">
							<div class="tool_icon tool_rowone"></div>
							<p class="icon_name">Cricinfo</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item">
							<div class="tool_icon"></div>
							<p class="icon_name">Cricinfo</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row2">
							<div class="tool_icon"></div>
							<p class="icon_name">Minutes</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row3">
							<div class="tool_icon"></div>
							<p class="icon_name">Weather</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row4">
							<div class="tool_icon"></div>
							<p class="icon_name">Feddly</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item">
							<div class="tool_icon"></div>
							<p class="icon_name icon_namelast">Feddly</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row2">
							<div class="tool_icon"></div>
							<p class="icon_name icon_namelast">Weather</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row3">
							<div class="tool_icon"></div>
							<p class="icon_name icon_namelast">Minutes</p>
						</div>
					</li>
					<li class="topspacing">
					  <div class="tool_item tool_row4">
							<div class="tool_icon"></div>
							<p class="icon_name icon_namelast">Cricinfo</p>
						</div>
					</li>
				</ul>
        <!-- 12 items per area -->
      </div>
    </div>		
  </div>
  <footer id="footer">
	  <div id="page_box">
			<ul id="page_bubbles">
					
			</ul>
			</div>
		</div>
    <p id="copyright">Copyright@2011 Google条款和隐私权</p>
  </footer>
    <script>
   
    changebubble();
    androidphoneadddiv();
    //window.scrollTo(0,1);
    </script> 
</body>
  </fmt:bundle>
</html>